:root {
	--space-1: 10px;
	--space-2: 12px;
	--space-3: 15px;
	--space-4: 20px;
	--space-5: 25px;
	--space-6: 30px;
	--space-7: 35px;
}
.unselect {
	user-select: none;
}
.g-relative {
	position: relative;
}
.block {
	display: block;
}
.cover {
	@include absCover;
	min-width: 100vw;
	min-height: 100vh;
	background: rgba(0, 0, 0, 0.3);
}
.c9 {
	color: #999;
}
.ct {
	color: $color_text;
}
.cg {
	color: #dfdfdf;
}
.c-main {
	color: $color_main;
}
.c-text {
	color: $color_text;
}
.c-suc {
	color: $color_suc;
}
.em {
	color: $color_main;
}

.bg-white {
	background-color: white;
}
.bg-main {
	background-color: $color_main;
}
.block {
	display: block;
}
.text-center {
	text-align: center;
}
.text-right {
	text-align: right;
}
.text-nowrap {
	white-space: nowrap;
}
.text-elli {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
.bold {
	font-weight: 600;
}

.clearfix::after {
	display: block;
	content: '';
	clear: both;
	zoom: 1;
	overflow: hidden;
}

.fs_medium {
	font-size: $font_medium;
}
.fs_small {
	font-size: $font_small;
}
.fs_large {
	font-size: $font_large;
}
.fs_big {
	font-size: $font_big;
}
.fs_max {
	font-size: $font_max;
}
.p-5 {
	padding: $space_5;
}
.p-4 {
	padding: $space_4;
}
.p-3 {
	padding: $space_3;
}
.p-2 {
	padding: $space_2;
}
.p-1 {
	padding: $space_1;
}

.pt-5 {
	padding-top: $space_5;
}
.pt-4 {
	padding-top: $space_4;
}
.pt-3 {
	padding-top: $space_3;
}
.pt-2 {
	padding-top: $space_2;
}
.pt-1 {
	padding-top: $space_1;
}

.pil-5 {
	padding-inline: $space_5;
}
.pil-4 {
	padding-inline: $space_4;
}
.pil-3 {
	padding-inline: $space_3;
}
.pil-2 {
	padding-inline: $space_2;
}
.pil-1 {
	padding-inline: $space_1;
}

.pbl-5 {
	padding-block: $space_5;
}
.pbl-4 {
	padding-block: $space_4;
}
.pbl-3 {
	padding-block: $space_3;
}
.pbl-2 {
	padding-block: $space_2;
}
.pbl-1 {
	padding-block: $space_1;
}

.m-5 {
	margin: $space_5;
}
.m-4 {
	margin: $space_4;
}
.m-3 {
	margin: $space_3;
}
.m-2 {
	margin: $space_2;
}
.m-1 {
	margin: $space_1;
}

.mt-5 {
	margin-top: $space_5;
}
.mt-4 {
	margin-top: $space_4;
}
.mt-3 {
	margin-top: $space_3;
}
.mt-2 {
	margin-top: $space_2;
}
.mt-1 {
	margin-top: $space_1;
}

.mb-5 {
	margin-bottom: $space_5;
}
.mb-4 {
	margin-bottom: $space_4;
}
.mb-3 {
	margin-bottom: $space_3;
}
.mb-2 {
	margin-bottom: $space_2;
}
.mb-1 {
	margin-bottom: $space_1;
}

.mr-5 {
	margin-right: $space_5;
}
.mr-4 {
	margin-right: $space_4;
}
.mr-3 {
	margin-right: $space_3;
}
.mr-2 {
	margin-right: $space_2;
}
.mr-1 {
	margin-right: $space_1;
}

.ml-5 {
	margin-left: $space_5;
}
.ml-4 {
	margin-left: $space_4;
}
.ml-3 {
	margin-left: $space_3;
}
.ml-2 {
	margin-left: $space_2;
}
.ml-1 {
	margin-left: $space_1;
}

.mil-auto {
	margin-inline: auto;
}
.mil-5 {
	margin-inline: $space_5;
}
.mil-4 {
	margin-inline: $space_4;
}
.mil-3 {
	margin-inline: $space_3;
}
.mil-2 {
	margin-inline: $space_2;
}
.mil-1 {
	margin-inline: $space_1;
}

.mbl-5 {
	margin-block: $space_5;
}
.mbl-4 {
	margin-block: $space_4;
}
.mbl-3 {
	margin-block: $space_3;
}
.mbl-2 {
	margin-block: $space_2;
}
.mbl-1 {
	margin-block: $space_1;
}

.pr-5 {
	padding-right: $space_5;
}
.pr-4 {
	padding-right: $space_4;
}
.pr-3 {
	padding-right: $space_3;
}
.pr-2 {
	padding-right: $space_2;
}
.pr-1 {
	padding-right: $space_1;
}

.pb-5 {
	padding-bottom: $space_5;
}
.pb-4 {
	padding-bottom: $space_4;
}
.pb-3 {
	padding-bottom: $space_3;
}
.pb-2 {
	padding-bottom: $space_2;
}
.pb-1 {
	padding-bottom: $space_1;
}

.px-5 {
	padding-inline: $space_5;
}
.px-4 {
	padding-inline: $space_4;
}
.px-3 {
	padding-inline: $space_3;
}
.px-2 {
	padding-inline: $space_2;
}
.px-1 {
	padding-inline: $space_1;
}

.py-5 {
	padding-block: $space_5;
}
.py-4 {
	padding-block: $space_4;
}
.py-3 {
	padding-block: $space_3;
}
.py-2 {
	padding-block: $space_2;
}
.py-1 {
	padding-block: $space_1;
}

.radius-1 {
	border-radius: $border_radius_1;
}
.radius-2 {
	border-radius: $border_radius_2;
}
.radius-3 {
	border-radius: $border_radius_3;
}
.radius-4 {
	border-radius: $border_radius_4;
}
.radius-5 {
	border-radius: $border_radius_5;
}
.radius-6 {
	border-radius: $border_radius_6;
}
.shadow {
	box-shadow: $box_shadow_1;
}
.for-touch {
	position: relative;
	::after {
		position: absolute;
		top: -50%;
		left: -50%;
		width: 200%;
		height: 200%;
		content: '';
	}
}
@keyframes rotate {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotate(360deg);
	}
}

@keyframes rotateY {
	0% {
		transform: rotateY(0);
	}

	100% {
		transform: rotateY(360deg);
	}
}
